'use strict'
import { Button, View } from '../../component'
import style from './css.css'
class ControlBox extends React.Component {
  static propTypes = {
    state: PropTypes.number,
    coin: PropTypes.number,
    history: PropTypes.object,
    dollDetail: PropTypes.object,
    tap: PropTypes.func,
    playerMsg: PropTypes.object
  }
  _renderBtn () {
    const { state, playerMsg } = this.props
    if (state === -1) {
      return (
        <Button
          key={1}
          tap={() => { if (state === -1) { this.props.tap() } }}
          tapClassName={style.startBtnPress}
          className={ style.startBtn }
        >开始抓娃娃</Button>
      )
    }
    else if (this.props.state >= 0) {
      return (
        <View key={2} className={ style.startBtnGray } >准备开始</View>
      )
    }
    else if (this.props.state === -2) {
      return (
        <View key={3} className={ style.startBtnGray } >
          <View className={ style.hasMenber }>
            <View className={ style.hasMenberImage } style={{ backgroundImage: `url(${playerMsg.avatar})` }} >
            </View>
            <View className={ style.hasMenberMsg } >
              <View className={ style.hasMenberMsgName }> { playerMsg.name } </View>
              <View className={ style.hasMenberMsgGame }>游戏中</View>
            </View>
          </View>
        </View>
      )
    }
    else if (this.props.state === -3) {
      return (<View key={4} className={ style.startBtnGray } >维护中</View>)
    }
  }
  render () {
    return (
      <View className={ this.props.state === 2 ? style.hide : style.control }>
        { this._renderBtn() }
        <View className={ style.goldText }>
          <View className={ style.goldTextLine }>本次<View className={ style.goldTextMoney }>{ this.props.dollDetail.doll_play_pay }币</View></View>
          <View className={ style.goldTextLine }>余额<View className={ style.goldTextMoney }>{ this.props.coin }币</View></View>
          <Button tap={() => { window.location.href = 'imgotv://coinpay?f=6' }} tapClassName={style.chargeBtnPress} className={ style.chargeBtn } >充值</Button>
        </View>
      </View>
    )
  }
}

export default ControlBox
